<template>
    <div class="messagelist">
        <div class="content">
            <div class="inputs">
                <div class="input-text"><i>*</i>问题标题</div>
                <van-field class="isinput" v-model="title" @input="changeTitle" placeholder="请输入问题标题" />
            </div>
            <div class="inputs">
                <div class="input-text"><i>*</i>问题内容</div>
                <van-field type="textarea" class="istextarea" @input="changeContent" rows="8" autosize v-model="content" placeholder="请输入问题内容" />
            </div>
            <button class="saveBtn" v-if="isSave" @click="getRelease">确认发布</button>
            <button class="noBtn" v-if="!isSave" @click="getRelease">确认发布</button>
        </div>
    </div>
</template>

<script>
import { Toast,Field,Dialog  } from 'vant';
import {getRelease} from '@/api/message'
export default {
    name:'releaseMessage',
    //声明组件
    components:{
        [Field.name]:Field,
        [Toast.name]:Toast,
        [Dialog.name]:Dialog
    },
    data(){
        return {
            isSave:false,//是否可以发布
            title:'',//问题标题
            content:'',//问题内容
            token:''//登录用户的token
        }
    },
    created(){
       //获取token
       if(this.$route.query.token){
           this.token = this.$route.query.token;
       }
    },
    methods:{
        //提交
        getRelease(){
            if(this.title == ''){
                Toast('请输入问题标题'); return false;
            }else if(this.content == ''){
                Toast('请输入问题内容'); return false;
            }else {
                getRelease(this.token,this.title,this.content).then(res => {
                    if(res.code == 200){
                        //跳转提交审核页面
                        let para = {};
                        para.title = '提交审核';
                        para.url = '/releaseSuccess';
                        this.interaction.hLink(para);
                    }else if(res.code == 403){
                        Dialog.alert({
                            title: '提示',
                            message: '您的账号被挤下线，请重新登录',
                            confirmButtonText:'去登陆'
                        }).then(() => {
                            //跳转原生登录
                            let para = {};
                            para.linkType = "login";
                            this.interaction.hLinkToApp(para);
                        });
                    }else{
                        Toast.fail('提交失败');
                    }
                })
            }
        },
        //获取标题
        changeTitle(value){
            this.title = value
            if(this.title != '' && this.content != ''){
                this.isSave = true;
            }else {
                this.isSave = false;
            }
        },
        //获取详情
        changeContent(value){
            this.content = value;
            if(this.title != '' && this.content != ''){
                this.isSave = true;
            }else {
                this.isSave = false;
                }
        },
        
    }
    
}

</script>

<style lang="stylus" scoped>
 .messagelist{
    width :100%;
    height :100%;
    .content{
        padding:.266667rem;
        .inputs {
            margin-top :.266667rem;
            margin-bottom :.266667rem;
            .input-text {
                font-size :.4rem;
                font-weight :bold;
                color :#494949;
                i {
                    color :red;
                }
            }
            .isinput {
                font-size :.373333rem;
                height:1.066667rem;
                background:#f1f1f1;
                border-radius :.266667rem;
                margin-top :.266667rem;
                margin-bottom :.266667rem;
            }
            .istextarea {
                font-size :.373333rem;
                background:#f1f1f1;
                border-radius :.266667rem;
                margin-top :.266667rem;
                margin-bottom :.266667rem;
            }
        }
        .saveBtn {
            position:fixed;
            bottom :0;
            left :0;
            width :100%;
            height :1.2rem;
            background:#0079f3;
            color:#ffffff;
            font-size :.426667rem;
        }
        .noBtn {
            position:fixed;
            bottom :0;
            left :0;
            width :100%;
            height :1.2rem;
            background:#A2A2A2;
            color:#ffffff;
            font-size :.426667rem;
        }
    }
       
}    
</style>